<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link href="/diaShop/css/common.css" rel="stylesheet" type="text/css"/>
    <link href="/diaShop/css/style.css" rel="stylesheet" type="text/css"/>
    <link href="/diaShop/fonts/iconfont.css" rel="stylesheet" type="text/css"/>
    <script src="/diaShop/js/jquery-1.9.1.min.js" type="text/javascript"></script>
    <script src="/diaShop/js/jqzoom.js" type="text/javascript"></script>
    <script src="/diaShop/js/jquery.SuperSlide.2.1.1.js" type="text/javascript"></script>
    <script src="/diaShop/js/common_js.js" type="text/javascript"></script>
    <script src="/diaShop/js/footer.js" type="text/javascript"></script>
    <script src="/diaShop/js/lrtk.js" type="text/javascript"></script>
    <script src="/js/plugins/layer/layer.min.js"></script>
    <title>产品详细页</title>
</head>
<body>
<div th:replace="diaShop/layout/mallHeader"></div>

<!--产品详细页介绍-->
<div class="Inside_pages">
    <!--位置-->
    <div class="Location_link">
        <em></em><a href="#">进口食品、进口牛</a> &lt; <a href="#">进口饼干/糕点</a> &lt; <a href="#"
                                                                               th:text="${goods.title}">产品名称</a>
    </div>
    <!--产品详细介绍-->
    <div class="Details_style clearfix" id="goodsInfo">
        <div class="mod_picfold clearfix">
            <div class="clearfix" id="detail_main_img">
                <div class="layout_wrap preview">
                    <div id="vertical" class="bigImg">
                        <img th:src="@{${goods.img}}" width="" height="" alt="" id="midimg"/>
                        <div style="display:none;" id="winSelector"></div>
                    </div>
                    <div class="smallImg">
                        <div class="scrollbutton smallImgUp disabled">&lt;</div>
                        <div id="imageMenu">
                            <ul>
                                <li th:each="g:${imgs}"><img th:src="@{${g}}" width="68" height="68" alt="洋妞"/></li>

                            </ul>
                        </div>
                        <div class="scrollbutton smallImgDown">&gt;</div>
                    </div><!--smallImg end-->
                    <div id="bigView" style="display:none;">
                        <div><img width="800" height="800" alt="" src=""/></div>
                    </div>
                </div>
            </div>
            <div class="Sharing">
                <div class="bdsharebuttonbox bdshare-button-style0-16" data-bd-bind="1455606466202"><a href="#"
                                                                                                       class="bds_more"
                                                                                                       data-cmd="more">分享到：</a><a
                        href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a><a href="#" class="bds_tsina"
                                                                                           data-cmd="tsina"
                                                                                           title="分享到新浪微博"></a><a
                        href="#" class="bds_tqq" data-cmd="tqq" title="分享到腾讯微博"></a><a href="#" class="bds_renren"
                                                                                       data-cmd="renren"
                                                                                       title="分享到人人网"></a><a href="#"
                                                                                                             class="bds_weixin"
                                                                                                             data-cmd="weixin"
                                                                                                             title="分享到微信"></a>
                </div>
                <script>window._bd_share_config = {
                    "common": {
                        "bdSnsKey": {},
                        "bdText": "",
                        "bdMini": "2",
                        "bdMiniList": false,
                        "bdPic": "",
                        "bdStyle": "0",
                        "bdSize": "16"
                    },
                    "share": {"bdSize": 16},
                    "image": {
                        "viewList": ["qzone", "tsina", "tqq", "renren", "weixin"],
                        "viewText": "分享到：",
                        "viewSize": "16"
                    },
                    "selectShare": {
                        "bdContainerClass": null,
                        "bdSelectMiniList": ["qzone", "tsina", "tqq", "renren", "weixin"]
                    }
                };
                </script>
                <!--收藏-->
                <div class="Collect"><a href="javascript:collect(92)"><em class="ico1"></em>收藏商品( 2345 )</a></div>
            </div>
        </div>
        <!--信息样式-->
        <div class="textInfo">

            <div class="title"><h1 th:text="${goods.title}">Mixx 炼乳奶酪饼干</h1>
                <p>进口饼干糕点 西式糕点 休闲轻松</p></div>
            <div class="mod_detailInfo_priceSales">
                <div class="margins">
                    <div class="Price clearfix"><label>价格</label><span th:text="${goods.prices}">¥10.9
                            <b></b></span></div>
                    <div class="Activity clearfix"><label>活动</label><span>指定商品满¥50，可换购以下任一商品</span></div>
                </div>
                <div class="s_Review">
                    <a href="#">好评率<b>95%</b>[评论<b th:text="${goods.replyhit}">87653</b>条]</a>
                </div>
            </div>
            <div class="buyinfo" id="detail_buyinfo">
                <dl>
                    <dt>数量</dt>
                    <dd>
                        <div class="choose-amount left">
                            <a class="btn-reduce" href="javascript:;" onclick="">-</a>
                            <a class="btn-add" href="javascript:;" onclick="">+</a>
                            <input class="text" id="count" value="1" onkeyup="">
                            <input th:hidden="true" th:value="${goods.id}" id="goodsid"/>
                        </div>
                        <div class="P_Quantity">剩余：50000件</div>
                    </dd>
                    <dd>
                        <div class="wrap_btn"><a onclick="addCart(1)" class="wrap_btn1"
                                                 title="加入购物车"></a>
                            <a onclick="addCart(2)" class="wrap_btn2" title="立即购买"></a></div>
                    </dd>
                </dl>
            </div>
            <div class="Guarantee clearfix">
                <dl>
                    <dt>支付方式</dt>
                    <dd><em></em>货到付款（部分地区）</dd>
                    <dd><em></em>在线支付</dd>
                    <dd>
                        <div class="payment" id="payment">
                            <a href="javascript:void(0);" class="paybtn">支付方式<span
                                    class=" iconfont icon-unfold"></span></a>
                            <ul>
                                <li>货到付款</li>
                                <li>礼品卡支付</li>
                                <li>网上支付</li>
                                <li>银行转账</li>
                            </ul>
                        </div>
                    </dd>
                </dl>
            </div>

        </div>
        <!--产品推荐-->
        <div class="Recommend">
            <div class="title_name">同类产品推荐</div>
            <div class="Recommend_list">
                <ul>
                    <li class="clearfix" th:each="typeGoods:${typeList}">
                        <div class="pic_img"><a th:href="@{'/diaShop/goodsDetail/'+${typeGoods.id}}">
                            <img th:src="@{${typeGoods.img}}" data-bd-imgshare-binded="1"></a>
                        </div>
                        <div class="r_content">
                            <div class="title">
                                <a th:href="@{'/diaShop/goodsDetail/'+${typeGoods.id}}"
                                   th:text="${typeGoods.title}">金龙鱼 </a></div>
                            <div class="p_Price" th:text="${typeGoods.prices}">￥32.50</div>
                        </div>
                    </li>

                </ul>
            </div>
        </div>
    </div>
    <!--信息内容-->
    <div class="detailed_info clearfix">
        <div class="left_style">
            <div class="Records">
                <div class="title_name">用户浏览记录</div>
                <ul>
                    <li th:unless="${#lists.isEmpty(viewGoodslist)}"
                        th:if="${starStat.count lt 4}" th:each="viewGoods,starStat:${viewGoodslist}">
                        <a th:href="@{'/diaShop/goodsDetail/'+${viewGoods.id}}">
                            <p><img th:src="@{${viewGoods.img}}" data-bd-imgshare-binded="1"></p>
                            <p class="p_name" th:text="${viewGoods.title}">San律宾进口</p>
                        </a>
                        <p><span class="p_Price" th:text="'￥'+${viewGoods.prices}">￥5.30</span>
                            <b th:text="'￥'+${viewGoods.prices}">10.4</b></p>
                    </li>

                </ul>
            </div>
        </div>
        <!---->
        <div class="right_style ">
            <div id="recommnad">
                <dl class="recommnad explosion ">
                    <dt><i></i>同类销售商品排行榜</dt>
                    <dd data-hover="hover" class="bordernone" th:each="com,stat:${commList}">
	   <span>
	    <a th:href="@{'/diaShop/goodsDetail/'+${com.id}}" class="pic">
            <img th:src="@{${com.img}}" width="130" height="130" data-bd-imgshare-binded="1"></a>
		<a th:href="@{'/diaShop/goodsDetail/'+${com.id}}" class="tit" th:text="${com.title}">Gullon谷优</a>
		<p th:text="${com.prices}">￥39.00</p>
		<a href="#" th:onclick="'addCart1('+${com.id}+')'" class="commandbtn">加入购物车</a>
	   </span>
                        <div class="exp_ico one" th:text="${stat.count}">2</div>
                    </dd>

                </dl>
            </div>
            <div class="inDetail_boxOut">
                <div class="inDetail_box">
                    <div class="fixed_out ">
                        <ul class="inLeft_btn">
                            <li><a id="property-id" href="#shangpsx" class="current">商品属性</a></li>
                            <li><a id="detail-id" href="#shangpjs">规格与包装</a></li>
                            <li><a id="shot-id" href="#miqsp">售后服务</a></li>
                            <li><a id="coms1-id" href="#coms1">买家评论</a></li>
                        </ul>
                        <div class="subbuy">
                            <span class="extra currentPrice"> ¥29.90</span>
                            <a href="#" class="extra  notice J_BuyButtonSub">立即购买</a></div>
                    </div>
                </div>
            </div>
            <!--信息-->
            <div id="shangpsx">
                <table>
                    <tr>
                        <td class="lable">商品名称</td>
                        <td>憨厚护肤套装</td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
</div>
<div th:replace="diaShop/layout/mallFooter"></div>
<script type="text/javascript">
    $("#collect1").hide();
    $("#qucollect1").hide();

    function addCart(type) {
        var count = $("#count").val();
        var goodsid = $("#goodsid").val();
        $.ajax({
            type: "post",
            url: '/person/diaShop/addCart',
            data: {
                goodsid: goodsid,
                count: count
            },
            dataType: "json",
            success: function (data) {
                if (data.code == 0) {
                    if (type == 1) {
                        layer.msg("加入购车成功!", 2, 8);
                    } else {
                        var goodsid1 = $("#goodsid").val();
                        window.location.href = "/person/diaShop/likBuy/" + goodsid1;
                    }
                } else if (data.success == 'login') {
                    window.location.href = "/diaShop/login"
                }
            }
        });
    }

    function addCart1(goodsid) {
        console.log(goodsid);
        var count = 1;
        $.ajax({
            type: "post",
            url: '/person/diaShop/addCart',
            data: {
                goodsid: goodsid,
                count: count
            },
            dataType: "json",
            success: function (data) {
                if (data.code == 0) {
                    window.location.href = "/person/diaShop/likBuy/" + goodsid;
                } else if (data.success == 'login') {
                    window.location.href = "/diaShop/login"
                }
            }
        });
    }

    // 收藏
    function collect(goodsid) {
        $.ajax({
            type: "post",
            url: '/person/diaShop/favorite-add',
            data: {
                goodsid: goodsid,
                type: 1
            },
            dataType: "json",
            success: function (data) {
                if (data.code == 0) {
                    $("#collect").hide();
                    $("#qucollect").show();
                    layer.msg("收藏成功!");
                } else {
                    layer.msg(data.msg);
                }
            }
        });
    }

    // 取消收藏
    function qucollect(goodsid) {
        $.ajax({
            type: "post",
            url: '/person/diaShop/favorite-add',
            data: {
                goodsid: goodsid,
                type: 1
            },
            dataType: "json",
            success: function (data) {
                if (data.code == 0) {
                    $("#collect").show();
                    $("#qucollect").hide();
                    layer.msg("取消收藏成功!");
                } else {
                    layer.msg(data.msg);
                }
            }
        });
    }

    function addRePly() {
        var content = $("#say_some").val();
        var goodsid = $("#goodsid").val();
        $.ajax({
            type: "post",
            url: '/person/diaShop/addRePly',
            data: {content: content, goodsid: goodsid},
            dataType: "json",
            success: function (data) {
                if (data.success) {
                    layer.msg("评论成功!", {icon: 2});

                } else {
                    layer.msg("评论失败!", {icon: 2});
                }
            }
        });
    }
</script>
</body>
</html>
